<template> 
	<div class="basicInformation">
		<!-- 基本信息导航栏 -->
		<div class="basicNavlist">
			<div class="basicNavitem" :class="basicNavnum===0 ? 'active' : ''" @click="toNavOne(0,'basicQiye')">企业信息</div>
			<div class="basicNavitem" :class="basicNavnum===1 ? 'active' : ''" @click="toNavOne(1,'basicGudong')">股东信息</div>
			<div class="basicNavitem" :class="basicNavnum===2 ? 'active' : ''" @click="toNavOne(2,'basicTuandui')">团队信息</div>
			<div class="basicNavitem" :class="basicNavnum===3 ? 'active' : ''" @click="toNavOne(3,'basicBiangen')">变更记录</div>
		</div>
		<!-- 基本信息导航对应的页面 -->
		<div class="basicContent">
			<!-- 企业信息页面 -->
			<basicQiye id="basicQiye" ></basicQiye>
			<!-- 股东信息页面 -->
			<basicGudong id="basicGudong"></basicGudong>
			<!-- 团队信息页面 -->
			<basicTuandui id="basicTuandui"></basicTuandui>
			<!-- 变更记录页面 -->
			<basicBiangen id="basicBiangen"></basicBiangen>
		</div>
	</div> 
</template>

<script>
	
	import basicQiye from './basicQiye.vue'
	import basicGudong from './basicGudong.vue'
	import basicTuandui from './basicTuandui.vue'
	import basicBiangen from './basicBiangen.vue'
	export default{
		// props:{
		// 	bcompany:{
		// 	    type:String,
		// 	    required:true
		// 	}
		// },
		// name:'basicInformation',
		data() {
			return{
				basicNavnum:0
			}
		},
		// watch:{
		// 	bcompany:function(val){
		// 		console.log(val)
		// 	}
		// },
		components:{
			basicQiye,
			basicGudong,
			basicTuandui,
			basicBiangen
		},
		methods:{
			// 获取当前导航栏下标,滑动对应的页面
			toNavOne(num,id){
				this.basicNavnum=num
					document.getElementById(id).scrollIntoView()
				
			}
		}
	}
</script>

<style lang="stylus" rel='stylesheet/stylus' scoped>
	@import "~@/assets/basicInformation.styl"
</style>
